<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格查询</title>
    <#assign base=request.contextPath  />
    <base id="base" href="${base}">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, adminUser-scalable=0">
    <link rel="stylesheet" href="${base}/static/win10/component/layui/css/layui.css" media="all">
    <script>
        var base = "${base}";
    </script>
</head>
<body>
<br>


<div class="demoTable" style="margin-left: 15px;">


    <form class="layui-form " action="">
        <div class="layui-form-item">
            <label>设备名称</label>
            <div class="layui-inline">
                <input class="layui-input" name="name" id="name" autocomplete="off">
            </div>
            <label>设备用途</label>
            <div class="layui-inline">
                <input class="layui-input" name="purpose" id="purpose" autocomplete="off">
            </div>
            <label>设备检定情况及相关要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="requirement" id="requirement" autocomplete="off">
            </div>
            <label>功能要求（协议书）</label>
            <div class="layui-inline">
                <input class="layui-input" name="function" id="function" autocomplete="off">
            </div>
            <label>性能指标要求（协议书）</label>
            <div class="layui-inline">
                <input class="layui-input" name="performance" id="performance" autocomplete="off">
            </div>
            <label>接口要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="Interface" id="Interface" autocomplete="off">
            </div>
            <label>重量要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="weight" id="weight" autocomplete="off">
            </div>
            <label>尺寸要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="size" id="size" autocomplete="off">
            </div>
            <label>电源特性要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="powerSupply" id="powerSupply" autocomplete="off">
            </div>
            <label>寿命</label>
            <div class="layui-inline">
                <input class="layui-input" name="life" id="life" autocomplete="off">
            </div>
            <label>可靠性要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="reliability" id="reliability" autocomplete="off">
            </div>
            <label>维修性要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="maintainability" id="maintainability" autocomplete="off">
            </div>
            <label>测试性要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="testability" id="testability" autocomplete="off">
            </div>
            <label>安全性要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="security" id="security" autocomplete="off">
            </div>
            <label>保障性要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="supportability" id="supportability" autocomplete="off">
            </div>
            <label>环境适应性要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="environment" id="environment" autocomplete="off">
            </div>
            <label>电磁兼容性要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="electromagnetism" id="electromagnetism" autocomplete="off">
            </div>
            <label>计量保障要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="metering" id="metering" autocomplete="off">
            </div>
            <label>包装运输要求</label>
            <div class="layui-inline">
                <input class="layui-input" name="packingTransport" id="packingTransport" autocomplete="off">
            </div>
            <label>技术资料</label>
            <div class="layui-inline">
                <input class="layui-input" name="technology" id="technology" autocomplete="off">
            </div>
            <button type="button" class="layui-btn" data-type="reload">
                <i class="layui-icon layui-icon-search">搜索</i>
            </button>
        </div>
    </form>
</div>
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="toolbarDemo">


    <form class="layui-form " action="">
        <div class="layui-form-item" style="margin-left: 15px;">


            <div class="layui-btn-group">

                <button type="button" class="layui-btn" lay-event="add" margin>增加</button>
                <button type="button" class="layui-btn" lay-event="del">删除</button>
            </div>
            <#--        style="float:right;" 移动右边         -->
            <div class="layui-btn-group" style="float:right;">
                <a href="${base}/aircraftanalysis/engine/get/template">
                    <button type="button" class="layui-btn">模板下载</button>
                </a>
                <button type="button" class="layui-btn" lay-event="import" id="imports">
                    <i class="layui-icon">&#xe67c;</i>导入数据
                </button>
            </div>

        </div>


    </form>
</script>

<script src="${base}/static/win10/component/layui/layui.js?t=1"></script>
<script src="${base}/static/win10/js/jquery-1.8.3.min.js?t=1"></script>
<script>
    layui.use(['table', 'upload'], function () {

        // 设置全局变量以保存选中行信息
        var ids = new Array();
        // 保存当前页全部数据id，点击全选时使用
        var tableIds = new Array();

        var upload = layui.upload;

        var table = layui.table;


        table.render({
            skin: 'line' //行边框风格
            , even: true //开启隔行背景
            , elem: '#test'
            , url: base + '/aircraftanalysis/engine/admin/findEngineByPage'
            , toolbar: '#toolbarDemo'
            , cols: [[
                {type: 'checkbox'},
                {field: 'id', title: '设备id'},
                {
                    field: 'name', title: '设备名称', templet: function (d) {
                        var name = d.name.split(`==`);
                        var str;
                        if (name[1]) {
                            str = '<img title="'+name[0]+'" src="'+name[1]+'">'
                        } else {
                            str = name[0];
                        }
                        return str;
                    }
                },
                {
                    field: 'purpose', title: '设备用途', templet: function (d) {
                        var purpose = d.purpose.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }
                },
                {field: 'requirement', title: '设备检定情况及相关要求', templet: function (d) {
                        var purpose = d.requirement.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'function', title: '功能要求（协议书）', templet: function (d) {
                        var purpose = d.function.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'performance', title: '性能指标要求（协议书）', templet: function (d) {
                        var purpose = d.performance.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'interface', title: '接口要求', templet: function (d) {
                        var purpose = d.interface.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'weight', title: '重量要求', templet: function (d) {
                        var purpose = d.weight.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'size', title: '尺寸要求', templet: function (d) {
                        var purpose = d.size.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'powerSupply', title: '电源特性要求', templet: function (d) {
                        var purpose = d.powerSupply.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'life', title: '寿命', templet: function (d) {
                        var purpose = d.life.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'reliability', title: '可靠性要求', templet: function (d) {
                        var purpose = d.reliability.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'maintainability', title: '维修性要求', templet: function (d) {
                        var purpose = d.maintainability.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'testability', title: '测试性要求', templet: function (d) {
                        var purpose = d.testability.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'security', title: '安全性要求', templet: function (d) {
                        var purpose = d.security.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'supportability', title: '保障性要求', templet: function (d) {
                        var purpose = d.supportability.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'environment', title: '环境适应性要求', templet: function (d) {
                        var purpose = d.environment.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'electromagnetism', title: '电磁兼容性要求', templet: function (d) {
                        var purpose = d.electromagnetism.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'metering', title: '计量保障要求', templet: function (d) {
                        var purpose = d.metering.split(`==`);
                        var str;
                        if (purpose[1]) {
                            str = '<img title="'+purpose[0]+'" src="'+purpose[1]+'">'
                        } else {
                            str = purpose[0];
                        }
                        return str;
                    }},
                {field: 'packingTransport', title: '包装运输要求', templet: function (d) {
                        var packingTransport = d.packingTransport.split(`==`);
                        var str;
                        if (packingTransport[1]) {
                            str = '<img title="'+packingTransport[0]+'" src="'+packingTransport[1]+'">'
                        } else {
                            str = packingTransport[0];
                        }
                        return str;
                    }},
                {field: 'technology', title: '技术资料'}
            ]]
            , page: true
            , id: 'testReload'
            , done: function (res) {
                console.log(res)

                // 设置当前页全部数据id到全局变量
                tableIds = res.data.map(function (value) {

                    return value.id;
                });


                // 设置当前页选中项
                $.each(res.data, function (idx, val) {


                    if (ids.indexOf(val.id) > -1) {

                        val["LAY_CHECKED"] = 'true';

                        //找到对应数据改变勾选样式，呈现出选中效果
                        let index = val['LAY_TABLE_INDEX'];


                        $('tr[data-index=' + index + '] input[type="toolbar"]').click();
                        form.render('toolbar'); //刷新toolbar选择框渲染
                    }
                });
                // 获取表格勾选状态，全选中时设置全选框选中
                var checkStatus = table.checkStatus('test');
                if (checkStatus.isAll) {
                    $('.layui-table-header th[data-field="0"] input[type="toolbar"]').prop('checked', true);
                    form.render('toolbar'); //刷新toolbar选择框渲染
                }


                //获取节点id
                var tableId = this.id;

                var tableElem = this.elem;
                //table render出来实际显示的table组件
                var tableViewElem = tableElem.next();

                upload.render({
                    elem: tableViewElem.find('#imports') //绑定元素
                    , url: base + '/aircraftanalysis/engine/Import/'    //上传接口
                    , accept: "file"
                    , before: function () {
                    }
                    , done: function (res) {
                        if (res.code == 200) {
                            //上传完毕回调
                            layer.msg("上传成功!")
                            window.location.reload();
                        } else {
                            layer.msg(res.message)
                        }

                    }
                    , error: function (res) {
                        //请求异常回调
                        alert(res.message)
                    }
                });
            }


        });
        //搜索
        var $ = layui.$, active = {
            reload: function () {
                //执行重载
                table.reload('testReload', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    , where: {
                        name: $("#name").val(),
                        purpose: $("#purpose").val(),
                        requirement: $("#requirement").val(),
                        function: $("#function").val(),
                        performance: $("#performance").val(),
                        Interface: $("#Interface").val(),
                        weight: $("#weight").val(),
                        size: $("#size").val(),
                        powerSupply: $("#powerSupply").val(),
                        life: $("#life").val(),
                        reliability: $("#reliability").val(),
                        maintainability: $("#maintainability").val(),
                        testability: $("#testability").val(),
                        security: $("#security").val(),
                        supportability: $("#supportability").val(),
                        environment: $("#environment").val(),
                        electromagnetism: $("#electromagnetism").val(),
                        metering: $("#metering").val(),
                        packingTransport: $("#packingTransport").val(),
                        technology: $("#technology").val()
                    }
                }, 'data');
            }
        };
        $('.demoTable .layui-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });


        //头工具栏事件
        table.on('toolbar(test)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id); //获取选中行状态
            var data = checkStatus.data;  //获取选中行数据

            var idList = []
            for (let i = 0; i < data.length; i++) {
                idList.push(data[i].id)
            }


            switch (obj.event) {
                case 'add':
                    //请继续补充以下逻辑
                    window.location.href = base + "/aircraftanalysis/engine/admin/addEngineHtml"
                    break;
                case 'edit':
                    if (data.length === 0) {
                        layer.alert("请选择一条数据")
                        return;
                    }
                    //请继续补充以下逻辑
                    window.location.href = base + "/aircraftanalysis/engine/admin/editEngineHtml?id=" + data[0].id
                    break;
                case 'show':
                    if (data.length === 0) {
                        layer.alert("请选择一条数据")
                        return;
                    }
                    //请继续补充以下逻辑
                    window.location.href = base + "/aircraftanalysis/engine/admin/showEngineHtml?id=" + data[0].id
                    break;

                case 'del':
                    if (data.length === 0) {
                        layer.alert("请选择一条数据")
                        return;
                    }
                    layer.confirm('真的要删除吗?', function (index) {
                        $.ajax({
                            type: "GET",
                            url: base + '/aircraftanalysis/engine/admin/delEngine',
                            data: {"datas": idList},
                            dataType: "json",
                            success: function (data) {
                                if (data.code === 200) {
                                    layer.msg(data.message)
                                    setTimeout(function () {
                                        window.location.reload();
                                    }, 500)
                                } else {
                                    layer.msg(data.message)
                                }
                            }
                        });
                    });
                    break;
            }
            ;
        });
        //监听行双击事件
        table.on('rowDouble(test)', function (obj) {
            var data = obj.data;
            window.location.href = base + "/aircraftanalysis/engine/admin/showEngineHtml?id=" + data.id
        });
    })
</script>
</body>
</html>